import 'package:flutter/material.dart';
import 'package:ct_pa_majordomo/widgets/normal_scaffold/index.dart';
import 'package:ct_pa_majordomo/pages/widgets/menu_block.dart';

class PaySettingPage extends StatelessWidget {
  const PaySettingPage({Key? key}) : super(key: key);

  void _showCustomTooltip(BuildContext context, String message) {
    final RenderBox button = context.findRenderObject() as RenderBox;
    final RenderBox overlay = Overlay.of(context).context.findRenderObject() as RenderBox;
    final Offset buttonPosition = button.localToGlobal(Offset.zero, ancestor: overlay);
    final Size buttonSize = button.size;

    OverlayEntry? overlayEntry;
    overlayEntry = OverlayEntry(
      builder: (context) => GestureDetector(
        onTap: () => overlayEntry?.remove(),
        child: Container(
          color: Colors.transparent,
          child: Stack(
            children: [
              Positioned(
                top: buttonPosition.dy + buttonSize.height + 5,
                left: buttonPosition.dx - 100 + (buttonSize.width / 2),
                child: Material(
                  color: Colors.transparent,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      CustomPaint(
                        size: const Size(20, 10),
                        painter: ArrowPainter(),
                      ),
                      Container(
                        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
                        decoration: BoxDecoration(
                          color: Colors.black87,
                          borderRadius: BorderRadius.circular(4),
                        ),
                        child: Text(
                          message,
                          style: const TextStyle(color: Colors.white, fontSize: 12),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );

    Overlay.of(context).insert(overlayEntry);
  }

  @override
  Widget build(BuildContext context) {
    return NormalScaffold(
      title: '支付设置',
      actions: [
        IconButton(
          icon: const Icon(Icons.more_vert, color: Colors.white),
          onPressed: () {},
        ),
      ],
      child: ListView(
        padding: const EdgeInsets.all(0),
        children: [
          // 第一组
          Padding(
            padding: const EdgeInsets.only(top: 12, left: 12, right: 12),
            child: MenuBlock(
              items: [
                MenuBlockItem(
                  text: '水电费线上充值',
                  suffix: Switch(value: true, onChanged: (v) {}),
                  showArrow: false,
                ),
                MenuBlockItem(
                  text: '',
                  content: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Row(children: [
                        Text("账单线上支付"),
                        const SizedBox(width: 4),
                        GestureDetector(
                          onTap: () => _showCustomTooltip(context, '开启后可通过小程序线上方式支付账单'),
                          child: Icon(Icons.help_outline, size: 16, color: Colors.grey),
                        ),
                      ],),
                      Switch(value: true, onChanged: (v) {})
                    ],
                  ),
                ),
                MenuBlockItem(
                  text: '到账时间',
                  suffix: const Text('T+1(工作日到账)', style: TextStyle(color: Colors.black54)),
                  showArrow: false,
                ),
              ],
            ),
          ),
          // 第二组
          Padding(
            padding: const EdgeInsets.only(top: 16, left: 12, right: 12),
            child: MenuBlock(
              title: const Text('基本信息', style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold)),
              items: [
                MenuBlockItem(
                  text: '姓名',
                  suffix: const Text('黄文勇', style: TextStyle(color: Colors.black54)),
                  showArrow: false,
                ),
                MenuBlockItem(
                  text: '商户简称',
                  suffix: const Text('劲叶公寓', style: TextStyle(color: Colors.black54)),
                  showArrow: false,
                ),
              ],
            ),
          ),
          // 第三组
          Padding(
            padding: const EdgeInsets.only(top: 16, left: 12, right: 12),
            child: MenuBlock(
              title: const Text('结算账户', style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold)),
              items: [
                MenuBlockItem(
                  text: '查看和更换结算银行账户',
                  suffix: const Text(' ', style: TextStyle(color: Colors.blue)),
                  showArrow: false,
                  onTap: () {},
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class ArrowPainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint()
      ..color = Colors.black87
      ..style = PaintingStyle.fill;

    final path = Path()
      ..moveTo(size.width / 2, 0)
      ..lineTo(0, size.height)
      ..lineTo(size.width, size.height)
      ..close();

    canvas.drawPath(path, paint);
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) => false;
} 